{# templates/form/custom_types.html.twig #}

{% block module_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module">
        <label class="control-label" for="module">
            模块
        </label>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            {% for module in admin_modules %}
                <div class="module-group box-body" style="padding: 10px 0px;">
                    <div class="group-info" style="background: #f7f7f7;padding: 10px">
                        <div class="icheckbox_minimal-blue" aria-checked="true" aria-disabled="false">
                            <input type="checkbox" class="minimal module-all" module_id="{{ module.id }}">
                            <label style="margin-left: 10px">{{ module.name }}</label>
                        </div>
                    </div>
                    {% if module.children|length > 0 %}
                        <div class="row" style="padding: 15px 0px 15px 46px;">
                            {% for item in module.children %}
                                <div class="col-sm-4 col-md-2" style="padding-bottom: 10px">
                                    <div class="icheckbox_minimal-blue" aria-checked="true" aria-disabled="false">
                                        <input type="checkbox" class="minimal module-item"
                                               name="module_idx[{{ module.id }}][]" value="{{ item.id }}">
                                        <span style="margin-left: 10px">{{ item.name }}</span>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
            {% endfor %}
        </div>
        <script>
            {# 初始赋值 #}
            let module_ids = {% if module_ids is null %}[]{% else %}{{ module_ids }}{% endif %};
            $('input.module-item').each(function (index, item) {
                if ($.inArray(parseInt(item.value), module_ids) != -1) {
                    $(this).iCheck('check');
                }
            });
            {# 全选/反选 #}
            $('input.module-all').on('ifClicked', function (event) {
                let module_id = $(this).attr('module_id');
                if (event.target.checked) {
                    $("input[name='module_idx[" + module_id + "][]']").iCheck('uncheck');
                } else {
                    $("input[name='module_idx[" + module_id + "][]']").iCheck('check');
                }
            });
        </script>
    </div>
{% endblock %}

{% block text_errors %}
    {% if errors|length > 0 %}
        <div class="help-block sonata-ba-field-error-messages">
            <ul class="list-unstyled">
                {% for error in errors %}
                    <li><i class="fa fa-exclamation-circle" aria-hidden="true"></i>
                        {{ error.message }}
                    </li>
                {% endfor %}
            </ul>
        </div>
    {% endif %}
{% endblock %}

{% block page_publish_field_row %}
    <div class="form-group" id="sonata-ba-field-container-{{ form.vars.id }}">
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <div class="checkbox" style="display: inline">
                <label class="">
                    <input type="checkbox" id="{{ form.vars.id }}" name="page_publish[status]"
                           {% if form.vars.object.publishStatus == 1 %}checked="checked"{% endif %}>
                    <span class="control-label__text">{{ form.vars.label }}</span>
                </label>
            </div>
            <div class="radio" style="display: inline;margin-left: 30px">
                <label>
                    <input type="radio" class="publish_type_radio" id="{{ form.parent.vars.id }}_publish_type_now"
                           name="page_publish[publish_type]" value="now">
                    <span style="font-weight: normal">立即发布</span>
                </label>
                <label style="padding-left: 20px">
                    <input type="radio" class="publish_type_radio" id="{{ form.parent.vars.id }}_publish_type_timing"
                           name="page_publish[publish_type]" value="timing">
                    <span style="font-weight: normal">定时发布</span>
                </label>
            </div>
            <span class="help-block sonata-ba-field-widget-help"></span>
        </div>
    </div>
    <div id="page_publish_type_timing_date" style="display: none">
        <div class="row">
            <div class="col-lg-6">
                <div class="input-group date" style="width: 100%">
                    <div class="input-group-addon" style="width: 12px; height: 20px;"><i class="fa fa-calendar"></i>
                    </div>
                    <input type="text" class="form-control pull-right" name="page_publish[publish_time_date]"
                           value="{% if form.vars.publish_time_date is null %}{{ "tomorrow"|date("Y-m-d") }}{% else %}{{ form.vars.publish_time_date }}{% endif %}"
                           style="background-color: #ffffff;" id="publish_type_timing_datepicker" readonly="readonly">
                </div>
            </div>
            <div class="col-lg-6">
                <div class="bootstrap-timepicker">
                    <div class="form-group">
                        <div class="input-group timepicker" style="width: 100%">
                            <div class="input-group-addon" style="width: 12px; height: 20px;"><i
                                        class="fa fa-clock-o"></i></div>
                            <input type="text" class="form-control timepicker"
                                   {% if form.vars.publish_time_time is not null %}value="{{ form.vars.publish_time_time }}"{% endif %}
                                   name="page_publish[publish_time_time]" id="publish_type_timing_timepicker">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        {# 初始发布模式状态 #}
        let init_value = '{% if form.vars.object.publishStatus == 1 %}on{% else %}off{% endif %}';
        let publish_type = '{{ form.vars.object.publishType }}';
        if (init_value == 'on') {
            $("input.publish_type_radio").attr('disabled', false);
            if (publish_type == 'now') {
                $('#{{ form.parent.vars.id }}_publish_type_now').iCheck('check');
            }
            if (publish_type == 'timing') {
                $('#{{ form.parent.vars.id }}_publish_type_timing').iCheck('check');
                $('#page_publish_type_timing_date').show();
            }
        } else {
            $("input.publish_type_radio").iCheck('uncheck');
            $("input.publish_type_radio").attr('disabled', true);
        }
        {# 文章状态切换 #}
        $('#{{ form.vars.id }}').on('ifClicked', function (event) {
            if (event.target.checked) {
                $("input.publish_type_radio").iCheck('uncheck');
                $("input.publish_type_radio").attr('disabled', true);
                $('#page_publish_type_timing_date').hide();
            } else {
                $("input.publish_type_radio").attr('disabled', false).parent().removeClass('disabled');
                $('#{{ form.parent.vars.id }}_publish_type_now').iCheck('check');
            }
        });
        {# 定时发布时显示时间选择器 #}
        $('input.publish_type_radio').on('ifClicked', function (event) {
            let publish_type_value = $(this).attr('value');
            if (publish_type_value == 'timing') {
                $('#page_publish_type_timing_date').show();
            } else {
                $('#page_publish_type_timing_date').hide();
            }
        });
        {# 日期选择器 #}
        $('#publish_type_timing_datepicker').datepicker({
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            startDate: 'now',
            autoclose: true,
        });
        {# 时间选择器 #}
        $('#publish_type_timing_timepicker').timepicker({
            showInputs: false,
            minuteStep: 30,
            showMeridian: false,
            disableFocus: true
        });
    </script>
{% endblock %}

{% block thumbnail_item_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module">
        <label class="control-label" for="module">
            {{ form.vars.label }}
        </label>
        <small style="margin-bottom: 5px;display: inherit">图片尺寸：1100x400像素，图片大小：1MB，点击空白处上传图片</small>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <input name="thumbnail" id="thumbnail_path" type="hidden"/>
            <div class="dropzone" id="dropzone-item">
                <div class="fallback">
                    <input name="file" type="file"/>
                </div>
            </div>
        </div>
        <script>
            Dropzone.autoDiscover = false; //自己手动初始化
            let drop_zone = new Dropzone("#dropzone-item", {
                paramName: 'file_data',
                url: '{{ path('admin_default_image_upload', {path: 'page'}) }}',
                method: 'post',
                uploadMultiple: false,
                maxFiles: 1,
                maxFilesize: 1,
                parallelUploads: 1,
                autoProcessQueue: true,
                resizeWidth: 1100,
                resizeHeight: 400,
                resizeMethod: 'crop', // contain或crop
                acceptedFiles: 'image/*',
                dictResponseError: '文件上传失败!', //提示信息
                dictFallbackMessage: "浏览器不受支持",
                dictFileTooBig: "文件过大，只允许1MB.",
                dictInvalidInputType: '文件类型错误',
                dictDefaultMessage: '点击上传图片',
                init: function () {
                    {% if form.vars.object.thumbnail is not null %}
                    // 显示默认图片
                    let mockFile = { name: "thumbnail", size: 500000 };
                    this.displayExistingFile(mockFile, "{{ form.vars.object.thumbnail }}");
                    {% endif %}
                    this.on("maxfilesexceeded", function (file) {
                        this.removeAllFiles();
                        this.addFile(file);
                    });
                    this.on("success", function (file, res) {
                        if (res.result.success) {
                            $('#thumbnail_path').val(res.content.url);
                        } else {
                            new NoticeJs({
                                text: res.result.error_msg,
                                type: 'error',
                                position: 'topCenter',
                                progressBar: true,
                                timeout: 30,
                                animation: {
                                    open: 'animated fadeIn',
                                    close: 'animated fadeOut'
                                }
                            }).show();
                        }
                    });
                    // 移除默认图片
                    this.on("addedfile", function (file, res) {
                        $('div.dz-preview.dz-complete.dz-image-preview').hide();
                    });
                }
            })
        </script>
    </div>
{% endblock %}

{% block setting_avatar_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module-avatar">
        <label class="control-label" for="module">
            {{ form.vars.label }}
        </label>
        <small style="margin-bottom: 5px;display: inherit">图片尺寸：120x120像素，图片大小：1MB，点击空白处上传图片</small>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <div class="dropzone" id="dropzone-item-avatar">
                <div class="fallback">
                    <input name="file" type="file"/>
                </div>
            </div>
        </div>
        <script>
            Dropzone.autoDiscover = false; //自己手动初始化
            let drop_zone_avatar = new Dropzone("#dropzone-item-avatar", {
                paramName: 'file_data',
                url: '{{ path('admin_default_image_upload', {path: 'setting'}) }}',
                method: 'post',
                uploadMultiple: false,
                maxFiles: 1,
                maxFilesize: 1,
                parallelUploads: 1,
                autoProcessQueue: true,
                resizeWidth: 120,
                resizeHeight: 120,
                resizeMethod: 'crop', // contain或crop
                resizeQuality: 1,
                acceptedFiles: 'image/*',
                dictResponseError: '文件上传失败!', //提示信息
                dictFallbackMessage: "浏览器不受支持",
                dictFileTooBig: "文件过大，只允许1MB.",
                dictInvalidInputType: '文件类型错误',
                dictDefaultMessage: '点击上传图片',
                init: function () {
                    {% if form.vars.object.avatar is not null %}
                    // 显示默认图片
                    let mockFile = { name: "avatar", size: 500000 };
                    this.displayExistingFile(mockFile, "{{ form.vars.object.avatar }}");
                    {% endif %}
                    this.on("maxfilesexceeded", function (file) {
                        this.removeAllFiles();
                        this.addFile(file);
                    });
                    this.on("success", function (file, res) {
                        if (res.result.success) {
                            $('#{{ form.parent.vars.id }}_avatar').val(res.content.url);
                        } else {
                            new NoticeJs({
                                text: res.result.error_msg,
                                type: 'error',
                                position: 'topCenter',
                                progressBar: true,
                                timeout: 30,
                                animation: {
                                    open: 'animated fadeIn',
                                    close: 'animated fadeOut'
                                }
                            }).show();
                        }
                    });
                    // 移除默认图片
                    this.on("addedfile", function (file, res) {
                        $('#sonata-ba-field-container-module-avatar div.dz-preview.dz-complete.dz-image-preview').hide();
                    });
                }
            })
        </script>
    </div>
{% endblock %}

{% block setting_image_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module-image">
        <label class="control-label" for="module">
            {{ form.vars.label }}
        </label>
        <small style="margin-bottom: 5px;display: inherit">图片尺寸：620x575像素，图片大小：1MB，点击空白处上传图片</small>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <div class="dropzone" id="dropzone-item-image">
                <div class="fallback">
                    <input name="file_image" type="file"/>
                </div>
            </div>
        </div>
        <script>
            Dropzone.autoDiscover = false; //自己手动初始化
            let drop_zone_image = new Dropzone("#dropzone-item-image", {
                paramName: 'file_data',
                url: '{{ path('admin_default_image_upload', {path: 'page'}) }}',
                method: 'post',
                uploadMultiple: false,
                maxFiles: 1,
                maxFilesize: 1,
                parallelUploads: 1,
                autoProcessQueue: true,
                resizeWidth: 620,
                resizeHeight: 575,
                resizeMethod: 'crop', // contain或crop
                resizeQuality: 1,
                acceptedFiles: 'image/*',
                dictResponseError: '文件上传失败!', //提示信息
                dictFallbackMessage: "浏览器不受支持",
                dictFileTooBig: "文件过大，只允许1MB.",
                dictInvalidInputType: '文件类型错误',
                dictDefaultMessage: '点击上传图片',
                init: function () {
                    {% if form.vars.object.image is not null %}
                    // 显示默认图片
                    let mockFile = { name: "image", size: 500000 };
                    this.displayExistingFile(mockFile, "{{ form.vars.object.image }}");
                    {% endif %}
                    this.on("maxfilesexceeded", function (file) {
                        this.removeAllFiles();
                        this.addFile(file);
                    });
                    this.on("success", function (file, res) {
                        if (res.result.success) {
                            $('#{{ form.parent.vars.id }}_image').val(res.content.url);
                        } else {
                            new NoticeJs({
                                text: res.result.error_msg,
                                type: 'error',
                                position: 'topCenter',
                                progressBar: true,
                                timeout: 30,
                                animation: {
                                    open: 'animated fadeIn',
                                    close: 'animated fadeOut'
                                }
                            }).show();
                        }
                    });
                    // 移除默认图片
                    this.on("addedfile", function (file, res) {
                        $('#sonata-ba-field-container-module-image div.dz-preview.dz-complete.dz-image-preview').hide();
                    });
                }
            })
        </script>
    </div>
{% endblock %}

{% block blogroll_logo_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module-blogroll-logo">
        <label class="control-label" for="module">
            {{ form.vars.label }}
        </label>
        <small style="margin-bottom: 5px;display: inherit">图片尺寸：120x120像素，图片大小：1MB，点击空白处上传图片</small>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <div class="dropzone" id="dropzone-item-blogroll-logo">
                <div class="fallback">
                    <input name="file" type="file"/>
                </div>
            </div>
        </div>
        <script>
            Dropzone.autoDiscover = false; //自己手动初始化
            let drop_zone_avatar = new Dropzone("#dropzone-item-blogroll-logo", {
                paramName: 'file_data',
                url: '{{ path('admin_default_image_upload', {path: 'blogroll'}) }}',
                method: 'post',
                uploadMultiple: false,
                maxFiles: 1,
                maxFilesize: 1,
                parallelUploads: 1,
                autoProcessQueue: true,
                resizeWidth: 120,
                resizeHeight: 120,
                resizeMethod: 'crop', // contain或crop
                resizeQuality: 1,
                acceptedFiles: 'image/*',
                dictResponseError: '文件上传失败!', //提示信息
                dictFallbackMessage: "浏览器不受支持",
                dictFileTooBig: "文件过大，只允许1MB.",
                dictInvalidInputType: '文件类型错误',
                dictDefaultMessage: '点击上传图片',
                init: function () {
                    {% if form.vars.object.logo is not null %}
                    // 显示默认图片
                    let mockFile = { name: "logo", size: 500000 };
                    this.displayExistingFile(mockFile, "{{ form.vars.object.logo }}");
                    {% endif %}
                    this.on("maxfilesexceeded", function (file) {
                        this.removeAllFiles();
                        this.addFile(file);
                    });
                    this.on("success", function (file, res) {
                        if (res.result.success) {
                            $('#{{ form.parent.vars.id }}_logo').val(res.content.url);
                        } else {
                            new NoticeJs({
                                text: res.result.error_msg,
                                type: 'error',
                                position: 'topCenter',
                                progressBar: true,
                                timeout: 30,
                                animation: {
                                    open: 'animated fadeIn',
                                    close: 'animated fadeOut'
                                }
                            }).show();
                        }
                    });
                    // 移除默认图片
                    this.on("addedfile", function (file, res) {
                        $('#sonata-ba-field-container-module-blogroll-logo div.dz-preview.dz-complete.dz-image-preview').hide();
                    });
                }
            })
        </script>
    </div>
{% endblock %}

{% block admin_user_avatar_field_row %}
    <div class="form-group" id="sonata-ba-field-container-module-admin-user-avatar">
        <label class="control-label" for="module">
            {{ form.vars.label }}
        </label>
        <small style="margin-bottom: 5px;display: inherit">图片尺寸：120x120像素，图片大小：1MB，点击空白处上传图片</small>
        <div class="sonata-ba-field sonata-ba-field-standard-natural">
            <div class="dropzone" id="dropzone-item-admin-user-avatar">
                <div class="fallback">
                    <input name="file" type="file"/>
                </div>
            </div>
        </div>
        <script>
            Dropzone.autoDiscover = false; //自己手动初始化
            let drop_zone_admin_user_avatar = new Dropzone("#dropzone-item-admin-user-avatar", {
                paramName: 'file_data',
                url: '{{ path('admin_default_image_upload', {path: 'admin_user'}) }}',
                method: 'post',
                uploadMultiple: false,
                maxFiles: 1,
                maxFilesize: 1,
                parallelUploads: 1,
                autoProcessQueue: true,
                resizeWidth: 120,
                resizeHeight: 120,
                resizeMethod: 'crop', // contain或crop
                resizeQuality: 1,
                acceptedFiles: 'image/*',
                dictResponseError: '文件上传失败!', //提示信息
                dictFallbackMessage: "浏览器不受支持",
                dictFileTooBig: "文件过大，只允许1MB.",
                dictInvalidInputType: '文件类型错误',
                dictDefaultMessage: '点击上传图片',
                init: function () {
                    {% if form.vars.object.avatar is not null %}
                    // 显示默认图片
                    let mockFile = { name: "avatar", size: 500000 };
                    this.displayExistingFile(mockFile, "{{ form.vars.object.avatar }}");
                    {% endif %}
                    this.on("maxfilesexceeded", function (file) {
                        this.removeAllFiles();
                        this.addFile(file);
                    });
                    this.on("success", function (file, res) {
                        if (res.result.success) {
                            $('#{{ form.parent.vars.id }}_avatar').val(res.content.url);
                        } else {
                            new NoticeJs({
                                text: res.result.error_msg,
                                type: 'error',
                                position: 'topCenter',
                                progressBar: true,
                                timeout: 30,
                                animation: {
                                    open: 'animated fadeIn',
                                    close: 'animated fadeOut'
                                }
                            }).show();
                        }
                    });
                    // 移除默认图片
                    this.on("addedfile", function (file, res) {
                        $('#sonata-ba-field-container-module-admin-user-avatar div.dz-preview.dz-complete.dz-image-preview').hide();
                    });
                }
            })
        </script>
    </div>
{% endblock %}

{# ... here you will add the Twig code ... #}